<template>
  <div class="grid-content">
    <div class="guide-name">
      <span class="iconfont icon-guide">&#xe69e;</span>
      <span>{{moduleName}}-{{innerModuleName}}</span>
    </div>
    <div class="guide-introduce">{{introduce}}</div>
  </div>
</template>

<script>
export default {
    props:['moduleName','innerModuleName','introduce'],
};
</script>

<style scoped lang="less">
.grid-content {
  min-height: 36px;
}
.guide-name {
  margin-top: 10px;
  font-size: 22px;
  .icon-guide {
    font-size: 26px;
    color: @themeColor;
    vertical-align: bottom;
  }
}
.guide-introduce {
  margin: auto;
  margin-top: 50px;
  width: 70%;
  font-size: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
</style>